<!DOCTYPE HTML>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
<title>直播首页</title>

<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="My Play Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template, 
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
	<!-- bootstrap -->
<link href="css/bootstrap.min.css" rel='stylesheet' type='text/css' media="all" />
<!-- //bootstrap -->
<link href="css/dashboard.css" rel="stylesheet">
<!-- Custom Theme files -->
<link href="css/style.css" rel='stylesheet' type='text/css' media="all" />
<script src="js/jquery-1.11.1.min.js"></script>
<!--start-smoth-scrolling-->
<!-- fonts -->
<link href='http://fonts.useso.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800' rel='stylesheet' type='text/css'>
<link href='http://fonts.useso.com/css?family=Poiret+One' rel='stylesheet' type='text/css'>
<!-- //fonts -->
</head>
  <body>

    <nav class="navbar navbar-inverse navbar-fixed-top">
		<input type="hidden" id="list" tname="list" value="${roomList.RoomInfo}">
		<input type="hidden" id="aa" tname="aa" value="">
      <div class="container-fluid">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
            <span class="sr-only">切换导航</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="index.html"><h1><img src="images/logo.png" alt="" /></h1></a>
        </div>
        <div id="navbar" class="navbar-collapse collapse">
			<div class="top-search">
				<form class="navbar-form navbar-right">
					<input type="text" class="form-control" placeholder="Search...">
					<input type="submit" value=" ">
				</form>
			</div>
			<div th:include="header :: header"></div>
        </div>
		<div class="clearfix"> </div>
      </div>
    </nav>
	<div th:include="menu :: menu"></div>
        <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
			<div class="main-grids">
				<div class="top-grids">
					<div class="recommended-info">
						<h3>最近视频</h3>
					</div>
					<div class="note" id="note" name="note">

					</div>
						<!--div class="col-md-4 resent-grid recommended-grid slider-top-grids">
							<div class="resent-grid-img recommended-grid-img">
								<a href="/single">
									<img src="images/t1.jpg" alt="" />
								</a>
								<div class="time">
									<p>3:04</p>
								</div>
								<div class="clck">
									<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
								</div>
							</div>
							<div class="resent-grid-info recommended-grid-info">
								<h3><a href="/single" class="title title-info">${roomInfo.roomDesc}</a></h3>
								<ul>
									<li><p class="author author-info"><a href="#" class="author">曼尼亚</a></p></li>
									<li class="right-list"><p class="views views-info">2,114,200 浏览</p></li>
								</ul>
							</div>

						</div>-->

					<div class="clearfix"> </div>
				</div>
				<div class="recommended">
					<div class="recommended-grids">
						<div class="recommended-info">
							<h3>动画片</h3>
						</div>
						<script src="js/responsiveslides.min.js"></script>
						 <script>
							// You can also use "$(window).load(function() {"
							$(function () {
							  // Slideshow 4
							  $("#slider3").responsiveSlides({
								auto: true,
								pager: false,
								nav: true,
								speed: 500,
								namespace: "callbacks",
								before: function () {
								  $('.events').append("<li>before event fired.</li>");
								},
								after: function () {
								  $('.events').append("<li>after event fired.</li>");
								}
							  });
						
							});
						  </script>
						<div  id="top" class="callbacks_container">
							<ul class="rslides" id="slider3">
								<li>
									<div class="animated-grids">
										<div class="col-md-3 resent-grid recommended-grid slider-first">
											<div class="resent-grid-img recommended-grid-img">
												<a href="/single"><img src="images/c.jpg" alt="" /></a>
												<div class="time small-time slider-time">
													<p>7:34</p>
												</div>
												<div class="clck small-clck">
													<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
												</div>
											</div>
											<div class="resent-grid-info recommended-grid-info">
												<h5><a href="/single" class="title">是多种多样的，但有时拽拽不无担忧</a></h5>
												<div class="slid-bottom-grids">
													<div class="slid-bottom-grid">
														<p class="author author-info"><a href="#" class="author">百世</a></p>
													</div>
													<div class="slid-bottom-grid slid-bottom-right">
														<p class="views views-info">2,114,200 浏览</p>
													</div>
													<div class="clearfix"> </div>
												</div>
											</div>
										</div>
										<div class="col-md-3 resent-grid recommended-grid slider-first">
											<div class="resent-grid-img recommended-grid-img">
												<a href="/single"><img src="images/c1.jpg" alt="" /></a>
												<div class="time small-time slider-time">
													<p>6:23</p>
												</div>
												<div class="clck small-clck">
													<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
												</div>
											</div>
											<div class="resent-grid-info recommended-grid-info">
												<h5><a href="/single" class="title">但有时也不害怕任何拉卡通不同</a></h5>
												<div class="slid-bottom-grids">
													<div class="slid-bottom-grid">
														<p class="author author-info"><a href="#" class="author">百世</a></p>
													</div>
													<div class="slid-bottom-grid slid-bottom-right">
														<p class="views views-info">14,200 浏览</p>
													</div>
													<div class="clearfix"> </div>
												</div>
											</div>
										</div>
										<div class="col-md-3 resent-grid recommended-grid slider-first">
											<div class="resent-grid-img recommended-grid-img">
												<a href="/single"><img src="images/c2.jpg" alt="" /></a>
												<div class="time small-time slider-time">
													<p>2:45</p>
												</div>
												<div class="clck small-clck">
													<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
												</div>
											</div>
											<div class="resent-grid-info recommended-grid-info">
												<h5><a href="/single" class="title">是多种多样的，但有时拽拽不害怕继电器</a></h5>
												<div class="slid-bottom-grids">
													<div class="slid-bottom-grid">
														<p class="author author-info"><a href="#" class="author">百世</a></p>
													</div>
													<div class="slid-bottom-grid slid-bottom-right">
														<p class="views views-info">2,114,200 浏览</p>
													</div>
													<div class="clearfix"> </div>
												</div>
											</div>
										</div>
										<div class="col-md-3 resent-grid recommended-grid slider-first">
											<div class="resent-grid-img recommended-grid-img">
												<a href="/single"><img src="images/c3.jpg" alt="" /></a>
												<div class="time small-time slider-time">
													<p>4:34</p>
												</div>
												<div class="clck small-clck">
													<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
												</div>
											</div>
											<div class="resent-grid-info recommended-grid-info">
												<h5><a href="/single" class="title">但有时也不害怕任何拉卡通不同</a></h5>
												<div class="slid-bottom-grids">
													<div class="slid-bottom-grid">
														<p class="author author-info"><a href="#" class="author">百世</a></p>
													</div>
													<div class="slid-bottom-grid slid-bottom-right">
														<p class="views views-info">2,114,200 浏览</p>
													</div>
													<div class="clearfix"> </div>
												</div>
											</div>
										</div>
										<div class="clearfix"> </div>
									</div>
								</li>
								<li>
									<div class="animated-grids">
										<div class="col-md-3 resent-grid recommended-grid slider-first">
											<div class="resent-grid-img recommended-grid-img">
												<a href="/single"><img src="images/c1.jpg" alt="" /></a>
												<div class="time small-time slider-time">
													<p>4:42</p>
												</div>
												<div class="clck small-clck">
													<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
												</div>
											</div>
											<div class="resent-grid-info recommended-grid-info">
												<h5><a href="/single" class="title">是多种多样的，但有时拽拽不无担忧</a></h5>
												<div class="slid-bottom-grids">
													<div class="slid-bottom-grid">
														<p class="author author-info"><a href="#" class="author">百世</a></p>
													</div>
													<div class="slid-bottom-grid slid-bottom-right">
														<p class="views views-info">2,114,200 浏览</p>
													</div>
													<div class="clearfix"> </div>
												</div>
											</div>
										</div>
										<div class="col-md-3 resent-grid recommended-grid slider-first">
											<div class="resent-grid-img recommended-grid-img">
												<a href="/single"><img src="images/c2.jpg" alt="" /></a>
												<div class="time small-time slider-time">
													<p>6:14</p>
												</div>
												<div class="clck small-clck">
													<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
												</div>
											</div>
											<div class="resent-grid-info recommended-grid-info">
												<h5><a href="/single" class="title">是多种多样的，但有时拽拽不无担忧</a></h5>
												<div class="slid-bottom-grids">
													<div class="slid-bottom-grid">
														<p class="author author-info"><a href="#" class="author">百世</a></p>
													</div>
													<div class="slid-bottom-grid slid-bottom-right">
														<p class="views views-info">2,114,200 浏览</p>
													</div>
													<div class="clearfix"> </div>
												</div>
											</div>
										</div>
										<div class="col-md-3 resent-grid recommended-grid slider-first">
											<div class="resent-grid-img recommended-grid-img">
												<a href="/single"><img src="images/c3.jpg" alt="" /></a>
												<div class="time small-time slider-time">
													<p>2:34</p>
												</div>
												<div class="clck small-clck">
													<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
												</div>
											</div>
											<div class="resent-grid-info recommended-grid-info">
												<h5><a href="/single" class="title">是多种多样的，但有时拽拽不无担忧</a></h5>
												<div class="slid-bottom-grids">
													<div class="slid-bottom-grid">
														<p class="author author-info"><a href="#" class="author">百事</a></p>
													</div>
													<div class="slid-bottom-grid slid-bottom-right">
														<p class="views views-info">2,114,200 浏览</p>
													</div>
													<div class="clearfix"> </div>
												</div>
											</div>
										</div>
										<div class="col-md-3 resent-grid recommended-grid slider-first">
											<div class="resent-grid-img recommended-grid-img">
												<a href="/single"><img src="images/c.jpg" alt="" /></a>
												<div class="time small-time slider-time">
													<p>5:12</p>
												</div>
												<div class="clck small-clck">
													<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
												</div>
											</div>
											<div class="resent-grid-info recommended-grid-info">
												<h5><a href="/single" class="title">是多种多样的，但有时拽拽不无担忧</a></h5>
												<div class="slid-bottom-grids">
													<div class="slid-bottom-grid">
														<p class="author author-info"><a href="#" class="author">百事</a></p>
													</div>
													<div class="slid-bottom-grid slid-bottom-right">
														<p class="views views-info">1,14,200 浏览</p>
													</div>
													<div class="clearfix"> </div>
												</div>
											</div>
										</div>
										<div class="clearfix"> </div>
									</div>
								</li>
								<li>
									<div class="animated-grids">
										<div class="col-md-3 resent-grid recommended-grid slider-first">
											<div class="resent-grid-img recommended-grid-img">
												<a href="/single"><img src="images/c2.jpg" alt="" /></a>
												<div class="time small-time slider-time">
													<p>4:42</p>
												</div>
												<div class="clck small-clck">
													<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
												</div>
											</div>
											<div class="resent-grid-info recommended-grid-info">
												<h5><a href="/single" class="title">是多种多样的，但有时拽拽不无担忧颠三倒四</a></h5>
												<div class="slid-bottom-grids">
													<div class="slid-bottom-grid">
														<p class="author author-info"><a href="#" class="author">百事</a></p>
													</div>
													<div class="slid-bottom-grid slid-bottom-right">
														<p class="views views-info">2,114,200 浏览</p>
													</div>
													<div class="clearfix"> </div>
												</div>
											</div>
										</div>
										<div class="col-md-3 resent-grid recommended-grid slider-first">
											<div class="resent-grid-img recommended-grid-img">
												<a href="/single"><img src="images/c3.jpg" alt="" /></a>
												<div class="time small-time slider-time">
													<p>6:14</p>
												</div>
												<div class="clck small-clck">
													<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
												</div>
											</div>
											<div class="resent-grid-info recommended-grid-info">
												<h5><a href="/single" class="title">大萨达是多种多样的，但有时拽拽不无担忧</a></h5>
												<div class="slid-bottom-grids">
													<div class="slid-bottom-grid">
														<p class="author author-info"><a href="#" class="author">可乐</a></p>
													</div>
													<div class="slid-bottom-grid slid-bottom-right">
														<p class="views views-info">2,114,200 浏览</p>
													</div>
													<div class="clearfix"> </div>
												</div>
											</div>
										</div>
										<div class="col-md-3 resent-grid recommended-grid slider-first">
											<div class="resent-grid-img recommended-grid-img">
												<a href="/single"><img src="images/c.jpg" alt="" /></a>
												<div class="time small-time slider-time">
													<p>2:34</p>
												</div>
												<div class="clck small-clck">
													<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
												</div>
											</div>
											<div class="resent-grid-info recommended-grid-info">
												<h5><a href="/single" class="title">顺风是多种多样的，但有时拽拽不无担忧</a></h5>
												<div class="slid-bottom-grids">
													<div class="slid-bottom-grid">
														<p class="author author-info"><a href="#" class="author">约定</a></p>
													</div>
													<div class="slid-bottom-grid slid-bottom-right">
														<p class="views views-info">2,114,200 浏览</p>
													</div>
													<div class="clearfix"> </div>
												</div>
											</div>
										</div>
										<div class="col-md-3 resent-grid recommended-grid slider-first">
											<div class="resent-grid-img recommended-grid-img">
												<a href="/single"><img src="images/c3.jpg" alt="" /></a>
												<div class="time small-time slider-time">
													<p>5:12</p>
												</div>
												<div class="clck small-clck">
													<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
												</div>
											</div>
											<div class="resent-grid-info recommended-grid-info">
												<h5><a href="/single" class="title">明白是多种多样的，但有时拽拽不无担忧</a></h5>
												<div class="slid-bottom-grids">
													<div class="slid-bottom-grid">
														<p class="author author-info"><a href="#" class="author">测算</a></p>
													</div>
													<div class="slid-bottom-grid slid-bottom-right">
														<p class="views views-info">1,14,200 浏览</p>
													</div>
													<div class="clearfix"> </div>
												</div>
											</div>
										</div>
										<div class="clearfix"> </div>
									</div>
								</li>
								<li>
									<div class="animated-grids">
										<div class="col-md-3 resent-grid recommended-grid slider-first">
											<div class="resent-grid-img recommended-grid-img">
												<a href="/single"><img src="images/c3.jpg" alt="" /></a>
												<div class="time small-time slider-time">
													<p>4:42</p>
												</div>
												<div class="clck small-clck">
													<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
												</div>
											</div>
											<div class="resent-grid-info recommended-grid-info">
												<h5><a href="/single" class="title">是多种多样的，但有时拽拽不无担忧</a></h5>
												<div class="slid-bottom-grids">
													<div class="slid-bottom-grid">
														<p class="author author-info"><a href="#" class="author">恰恰</a></p>
													</div>
													<div class="slid-bottom-grid slid-bottom-right">
														<p class="views views-info">2,114,200 浏览</p>
													</div>
													<div class="clearfix"> </div>
												</div>
											</div>
										</div>
										<div class="col-md-3 resent-grid recommended-grid slider-first">
											<div class="resent-grid-img recommended-grid-img">
												<a href="/single"><img src="images/c.jpg" alt="" /></a>
												<div class="time small-time slider-time">
													<p>6:14</p>
												</div>
												<div class="clck small-clck">
													<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
												</div>
											</div>
											<div class="resent-grid-info recommended-grid-info">
												<h5><a href="/single" class="title">是多种多样的，但有时拽拽不无担忧</a></h5>
												<div class="slid-bottom-grids">
													<div class="slid-bottom-grid">
														<p class="author author-info"><a href="#" class="author">洽洽</a></p>
													</div>
													<div class="slid-bottom-grid slid-bottom-right">
														<p class="views views-info">2,114,200 浏览</p>
													</div>
													<div class="clearfix"> </div>
												</div>
											</div>
										</div>
										<div class="col-md-3 resent-grid recommended-grid slider-first">
											<div class="resent-grid-img recommended-grid-img">
												<a href="/single"><img src="images/c1.jpg" alt="" /></a>
												<div class="time small-time slider-time">
													<p>2:34</p>
												</div>
												<div class="clck small-clck">
													<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
												</div>
											</div>
											<div class="resent-grid-info recommended-grid-info">
												<h5><a href="/single" class="title">是多种多样的，但有时拽拽不无担忧</a></h5>
												<div class="slid-bottom-grids">
													<div class="slid-bottom-grid">
														<p class="author author-info"><a href="#" class="author">洽洽</a></p>
													</div>
													<div class="slid-bottom-grid slid-bottom-right">
														<p class="views views-info">2,114,200 浏览</p>
													</div>
													<div class="clearfix"> </div>
												</div>
											</div>
										</div>
										<div class="col-md-3 resent-grid recommended-grid slider-first">
											<div class="resent-grid-img recommended-grid-img">
												<a href="/single"><img src="images/c2.jpg" alt="" /></a>
												<div class="time small-time slider-time">
													<p>5:12</p>
												</div>
												<div class="clck small-clck">
													<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
												</div>
											</div>
											<div class="resent-grid-info recommended-grid-info">
												<h5><a href="/single" class="title">是多种多样的，但有时拽拽不无担忧</a></h5>
												<div class="slid-bottom-grids">
													<div class="slid-bottom-grid">
														<p class="author author-info"><a href="#" class="author">洽洽</a></p>
													</div>
													<div class="slid-bottom-grid slid-bottom-right">
														<p class="views views-info">1,14,200 浏览</p>
													</div>
													<div class="clearfix"> </div>
												</div>
											</div>
										</div>
										<div class="clearfix"> </div>
									</div>
								</li>
							</ul>
						</div>
					</div>
				</div>
				<div class="recommended">
					<div class="recommended-grids">
						<div class="recommended-info">
							<h3>推荐</h3>
						</div>
						<div class="col-md-3 resent-grid recommended-grid">
							<div class="resent-grid-img recommended-grid-img">
								<a href="/single"><img src="images/r1.jpg" alt="" /></a>
								<div class="time small-time">
									<p>2:34</p>
								</div>
								<div class="clck small-clck">
									<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
								</div>
							</div>
							<div class="resent-grid-info recommended-grid-info video-info-grid">
								<h5><a href="/single" class="title">是多种多样的，但有时拽拽不无担忧</a></h5>
								<ul>
									<li><p class="author author-info"><a href="#" class="author">约翰</a></p></li>
									<li class="right-list"><p class="views views-info">2,114,200 浏览</p></li>
								</ul>
							</div>
						</div>
						<div class="col-md-3 resent-grid recommended-grid">
							<div class="resent-grid-img recommended-grid-img">
								<a href="/single"><img src="images/r2.jpg" alt="" /></a>
								<div class="time small-time">
									<p>3:02</p>
								</div>
								<div class="clck small-clck">
									<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
								</div>
							</div>
							<div class="resent-grid-info recommended-grid-info video-info-grid">
								<h5><a href="/single" class="title">精彩刺激是多种多样的，但有时拽拽不无担忧</a></h5>
								<ul>
									<li><p class="author author-info"><a href="#" class="author">小月</a></p></li>
									<li class="right-list"><p class="views views-info">2,114,200 浏览</p></li>
								</ul>
							</div>
						</div>
						<div class="col-md-3 resent-grid recommended-grid">
							<div class="resent-grid-img recommended-grid-img">
								<a href="/single"><img src="images/r3.jpg" alt="" /></a>
								<div class="time small-time">
									<p>1:34</p>
								</div>
								<div class="clck small-clck">
									<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
								</div>
							</div>
							<div class="resent-grid-info recommended-grid-info video-info-grid">
								<h5><a href="/single" class="title">是多种多样的，但有时拽拽不无担忧</a></h5>
								<ul>
									<li><p class="author author-info"><a href="#" class="author">明月</a></p></li>
									<li class="right-list"><p class="views views-info">2,114,200 浏览</p></li>
								</ul>
							</div>
						</div>
						<div class="col-md-3 resent-grid recommended-grid">
							<div class="resent-grid-img recommended-grid-img">
								<a href="/single"><img src="images/r4.jpg" alt="" /></a>
								<div class="time small-time">
									<p>2:09</p>
								</div>
								<div class="clck small-clck">
									<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
								</div>
							</div>
							<div class="resent-grid-info recommended-grid-info video-info-grid">
								<h5><a href="/single" class="title">是多种多样的，但有时拽拽不无担忧</a></h5>
								<ul>
									<li><p class="author author-info"><a href="#" class="author">明月</a></p></li>
									<li class="right-list"><p class="views views-info">2,114,200 浏览</p></li>
								</ul>
							</div>
						</div>
						<div class="clearfix"> </div>
					</div>
					<div class="recommended-grids">
						<div class="col-md-3 resent-grid recommended-grid">
							<div class="resent-grid-img recommended-grid-img">
								<a href="/single"><img src="images/r4.jpg" alt="" /></a>
								<div class="time small-time">
									<p>6:34</p>
								</div>
								<div class="clck small-clck">
									<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
								</div>
							</div>
							<div class="resent-grid-info recommended-grid-info video-info-grid">
								<h5><a href="/single" class="title">是多种多样的，但有时拽拽不无担忧</a></h5>
								<ul>
									<li><p class="author author-info"><a href="#" class="author">明月</a></p></li>
									<li class="right-list"><p class="views views-info">2,114,200 浏览</p></li>
								</ul>
							</div>
						</div>
						<div class="col-md-3 resent-grid recommended-grid">
							<div class="resent-grid-img recommended-grid-img">
								<a href="/single"><img src="images/r5.jpg" alt="" /></a>
								<div class="time small-time">
									<p>7:34</p>
								</div>
								<div class="clck small-clck">
									<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
								</div>
							</div>
							<div class="resent-grid-info recommended-grid-info video-info-grid">
								<h5><a href="/single" class="title">是多种多样的，但有时拽拽不无担忧</a></h5>
								<ul>
									<li><p class="author author-info"><a href="#" class="author">清风</a></p></li>
									<li class="right-list"><p class="views views-info">2,114,200 浏览</p></li>
								</ul>
							</div>
						</div>
						<div class="col-md-3 resent-grid recommended-grid">
							<div class="resent-grid-img recommended-grid-img">
								<a href="/single"><img src="images/r6.jpg" alt="" /></a>
								<div class="time small-time">
									<p>6:09</p>
								</div>
								<div class="clck small-clck">
									<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
								</div>
							</div>
							<div class="resent-grid-info recommended-grid-info video-info-grid">
								<h5><a href="/single" class="title">是多种多样的，但有时拽拽不无担忧</a></h5>
								<ul>
									<li><p class="author author-info"><a href="#" class="author">回家</a></p></li>
									<li class="right-list"><p class="views views-info">2,114,200 浏览</p></li>
								</ul>
							</div>
						</div>
						<div class="col-md-3 resent-grid recommended-grid">
							<div class="resent-grid-img recommended-grid-img">
								<a href="/single"><img src="images/r1.jpg" alt="" /></a>
								<div class="time small-time">
									<p>9:04</p>
								</div>
								<div class="clck small-clck">
									<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
								</div>
							</div>
							<div class="resent-grid-info recommended-grid-info video-info-grid">
								<h5><a href="/single" class="title">是多种多样的，但有时拽拽不无担忧</a></h5>
								<ul>
									<li><p class="author author-info"><a href="#" class="author">天涯</a></p></li>
									<li class="right-list"><p class="views views-info">2,114,200 浏览</p></li>
								</ul>
							</div>
						</div>
						<div class="clearfix"> </div>
					</div>
				</div>
			</div>
			<!-- footer -->
			<div class="footer">

			</div>
			<!-- //footer -->
		</div>
		<div class="clearfix"> </div>
	<div class="drop-menu">
		<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu4">
		  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Regular link</a></li>
		  <li role="presentation" class="disabled"><a role="menuitem" tabindex="-1" href="#">Disabled link</a></li>
		  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another link</a></li>
		</ul>
	</div>
    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="js/bootstrap.min.js"></script>
        <script>
            $(document).ready(function(){
                var datas;
                var formData = new FormData();
                formData.append("current",1);
                formData.append("pageSize",3);
                $.ajax({
                    url: "/queryRoomInfoList",
                    type: 'POST',
                    data: formData,
                    async:false,
                    processData:false,
                    contentType:false,
                    success: function (data) {
                        console.log(data);
                        //datas = JSON.stringify(data.data);
                        datas = data.data;
                        console.log("datas111:"+datas);

                        var html="";
                        for (var k in datas) {
                            var jsonObj = datas[k];
                            //jsonObj = JSON.stringify(jsonObj);
                            //jsonObj = JSON.parse(jsonObj);
                            //for (var i = 0, len = jsonObj.length; i < len; i++) {
							console.log("roomTitle："+jsonObj.roomTitle)
                            html+="<div class=\"col-md-4 resent-grid recommended-grid slider-top-grids\">\n" +
                                "\t\t\t\t\t\t<div class=\"resent-grid-img recommended-grid-img\">\n"
                            html+="<a href='/single/id=";
							html+=jsonObj.id.toString();
							html+="'>\n"+
								"<img src=\"images/t1.jpg\" alt=\"\" /></a>\n" +
                                "\t\t\t\t\t\t\t<div class=\"time\">\n" +
                                "\t\t\t\t\t\t\t\t<p>3:04</p>\n" +
                                "\t\t\t\t\t\t\t</div>\n" +
                                "\t\t\t\t\t\t\t<div class=\"clck\">\n" +
                                "\t\t\t\t\t\t\t\t<span class=\"glyphicon glyphicon-time\" aria-hidden=\"true\"></span>\n" +
                                "\t\t\t\t\t\t\t</div>\n" +
                                "\t\t\t\t\t\t</div>\n" +
                                "\t\t\t\t\t\t<div class=\"resent-grid-info recommended-grid-info\">\n" +
                                "\t\t\t\t\t\t\t<h3><a href='/single' class=\"title title-info\"> \n"
                            html+=jsonObj.roomTitle;
							html+="</a></h3>"+
                                "\t\t\t\t\t\t\t<ul>\n" +
                                "\t\t\t\t\t\t\t\t<li><p class=\"author author-info\"><a href=\"#\" class=\"author\">\n"
                            html+=jsonObj.chatroomId;
                            html+="</a></p></li>"+

                                "\t\t\t\t\t\t\t\t<li class=\"right-list\"><p class=\"views views-info\">2,114,200 views</p></li>\n" +
                                "\t\t\t\t\t\t\t</ul>\n" +
                                "\t\t\t\t\t\t</div>\n" +
                                "\t\t\t\t\t</div>";

                            /*html+="<div class=\"col-md-4 resent-grid recommended-grid slider-top-grids\">";
                            html+="<div class=\"resent-grid-img recommended-grid-img\">";
                            html+="<a href=\"/single\"><img src=\"images/t1.jpg\" alt=\"\" /></a>";
                            html+="<div class=\"time\">";
                            html+="<p>3:04</p>";
                            html+="<div class='time'>";
                            html+="</div>";
                            html+="<div class=\"clck\">";
                            html+="<span class=\"glyphicon glyphicon-time\" aria-hidden=\"true\"></span>";
                            html+="</div>";
                            html+="</div>";
                            html+="<div class='resent-grid-info recommended-grid-info'>";
                            html+="<h3>";
                            html+="<a href='/single' class='title title-info'>jsonObj.roomDesc</a>";
                            html+="</h3>";
                            html+="<ul>";
                            html+="<li><p class='author author-info'><a href='#' class='author'>曼尼亚</a></p></li>";
                            html+="<li class='right-list'><p class='views views-info'>2,114,200 浏览</p></li>";
                            html+="</ul>";
                            html+="</div>";
                            html+="</div>";*/

                            }
                        //}
                        $("#note").html(html);
                        document.getElementById("aa").valueOf(22);

                    },
                    error: function (data) {
                        console.log(data.code);
                    }
                });

            })


            function getDetail(id) {
                var formData = new FormData();
                formData.append("id",id);
                $.ajax({
                    url: "/single",
                    type: 'GET',
                    data: formData,
                    async:false,
                    processData:false,
                    contentType:false,
                    success: function (data) {
                        console.log(data);


                    },
                    error: function (data) {
                        console.log(data.code);
                    }
                });

            }
	</script>
    <!-- Just to make our placeholder images work. Don't actually copy the next line! -->
  </body>
</html>